// 数据类型：五个数据类型  字符串  数值   布尔   对象  数组
// 数据类型的定义：
// var 在新版本里面不适用，已经被替换成let 和const
// js 不区分单双引号
// const name = 'supeng';
// let realName = "supengtwo";
// var age = 18;
// var isMale = true;
// // 对象里面 包含属性（描述对象）
// var obj = {name: name, age: age, isMale: false};//key-value
// //js 的数组的数据类型 是Object 就是说可以放任何数据类型
// var arr = [name, age, isMale, obj, [obj]];
// // 为什么要被换成let 和const？
// //
// if (true) {
//     let realNamea = "supengtwo";
//     var agea = 18;
// }
// // js打印到控制台
// console.log(realName, "realName")
// console.log(age, "age")
// // console.log(realNamea,"realNamea")
// console.log(agea, "agea")
// let 理解成  局部变量
// var 具有穿透能力，不安全 不严谨
// const  理解成 常量

// 以后，无论是前后端  或者是  其他语言   如果想要数据，都是以对象的形式进行传递
// 而且都是以json对象进行传递
// 其实用法都是一样的  只不过为了区分，json对象 对key用引号描述，对象可以不写引号
// let jsonObj = {"name": "supeng", "age": 18};
// let object = {name: "supeng", age: 18};
// 他们用法一模一样
// js 也有方法
// let name = getName();

// function getName() {
//     return "name";
// }
//
// setName("supeng");
//
// function setName(name) {
//     this.name = name;
// }

// 常用方法：字符，数字，数学，日期， String  Array   Date  Math
// js 怎么得到当前的数据类型
// console.log(typeof name)
// let aa = "我是'\"中国\"的公民'";
// console.log(aa);
// let str = "The full name11 of China is 22the " +
//     "\nPeople's Republic of China.";
// let pos1 = str.indexOf("China");
// let pos2 = str.lastIndexOf("China");
// let pos3 = str.indexOf(/[0-9]/)
// console.log(pos1, pos2);
// str.replace('China', 'china');
//js replace只会替换第一个符合条件的，Java会替换所有符合条件的
// js如果想要替换所有，则会用正则表达式， /(china)/mig
// str.charAt(11);
// console.log(str.charCodeAt(1));


// let time = new Date().Format("yyyy-MM-dd hh:mm:ss");
// console.log(time)
// let num = Math.random() * 5 + 5;
// $("#top").load("");
// 对div进行事件的监听
$(function () {
    $("#imgCode").click(function () {
        changeCode();
    });
})

function changeCode() {
    // console.log(11)
    // 浏览器的保护机制，只要你访问后台的地址一样，那么浏览器直接去缓存里面去取数据
    // 所以为了每次都放我后台，我们需要将访问后台的地址进行重新设置
    $("#imgCode").attr("src", "/code?aa=" + Math.random());
    // $(obj).attr("src", "/code?aa="+Math.random());
    // console.log(22);
}

// 点击提交按钮之前，会默认执行一个验证：输入格式验证
// 点击layui的按钮之前，会默认触发自带的验证

<!--    页面交互：事件，，进行点击时有反应-->
$(function () {
    // 引入layui框架,form表单
    layui.use('form', function () {
        // 得到form表单
        var form = layui.form;
        // layer.msg('玩命卖萌中', function(){
        //   //关闭后的操作
        //   });
        let str = "fdsafasd\nfasdfasd";
        //自定义验证规则
        form.verify({
            username: [/^[a-z][a-z0-9]{5,15}$/, "密码必须以字母开头，6到16为字符，数字"],
            password: [/(.+){6,12}$/, '密码必须6到12位'],
            code: [/[a-z0-9]{5}/gim, "aaa"]
        });

        //监听提交
        form.on('submit(login)', function (data) {
            data = data.field;//以后这计划必写
            // alert(888)
            //将数据拿到后，传递到Java后台servlet层
            // layer.msg(JSON.stringify(data.field), function () {
            //     location.href = 'index.html'
            // });
            console.log(data);
            //我们最终需要的数据是data里面的field
            //怎么传递到后台呢？ajax
            $.ajax({
                url: '/login',//访问后台servlet层的地址
                data: data,
                type: 'post',//对于后台的方法
                dataType: 'json',//固定以json对象进行传递
                success: function (res) {//只要后台返回成功，才能进行当前方法，res表示后台返回的值
                    console.log(res);
                    if(res.msg=="error-code"){
                        layer.msg("你输入的验证码不正确，请重新输入");
                    }
                    if(res.msg=="error"){
                        layer.msg("你输入的用户名或者密码不正确，请重新输入");
                    }
                    if(res.msg=="success"){
                        //登录成功以后，要跳转到管理页面，欢迎页面，欢迎页面需要得到用户名
                        sessionStorage.setItem("username",data.username);
                        location.href='/html/index.html';
                        // window.history.go(-1)
                    }
                }
            })
            //点击按钮不让刷新页面
            return false;
        });
    });
})